<template>
  <n-layout-footer>
    <div class="footer">
      <div class="row">
        <div class="col-md-8 line-border common-href" style="border-right: 1px solid gray">
          <div>
            友情链接：
            <a href="https://laravel.com/" target="_blank">Laravel</a> |
            <a href="https://v3.bootcss.com" target="_blank">Bootstrap</a> |
            <a href="https://glyphicons.com" target="_blank">Glyphicons</a> |
            <a href="http://layer.layui.com/" target="_blank">Layer</a> |
            <a href="http://www.kuaidi.com/" target="_blank">快递API接口</a>
          </div>
          <div>本网站所列接口及文档全部由网上整理所得，如涉及版权，请联系我们下架</div>
        </div>
        <div class="col-md-4">
          <ul>
            <li class="wx" id="0"></li>
            <li class="email" id="1"></li>
          </ul>
        </div>
      </div>
      <div class="copyright">
        Copyright © 2024-2025
        <a href="http://beian.miit.gov.cn" target="_blank">皖ICP备17018155号-2</a>.
        All rights reserved | Design by FZS
      </div>
    </div>
  </n-layout-footer>
</template>

<script>
import { onMounted } from 'vue';
import { NLayoutFooter } from 'naive-ui';

export default {
  components: {
    NLayoutFooter
  },
  setup() {
    onMounted(() => {
      document.querySelectorAll('.footer li').forEach((el, index) => {
        el.addEventListener('mouseenter', () => {
          const content = ['微信公众号:XXXX', '电子邮箱:1234@.com'];
          const layerTip = layer.tips(content[index], el, {
            tips: [1, '#00bdff'],
            tipsMore: false,
            time: 4000
          });
          el.addEventListener('mouseleave', () => {
            layer.close(layerTip);
          });
        });
      });
    });
  }
};
</script>

<style scoped>
/* Add your scoped styles here */
</style>
